<template>
    <div>
        <div class="list-title" v-if="personLength>1&&itemList.length>0"><span class="list-title-line">|</span>&nbsp;&nbsp;{{  personList.name }}</div>
        <div class="list-row" >
            <el-form label-width="130px" label-position="left">
            <el-row :gutter="16">
                    <el-form-item 
                    v-for="(item,index) in itemList" :key="index"
                    :label="item.name+'：'">
                        <div class="list-input"></div>
                        </el-form-item>
                </el-row>
            </el-form>
        </div>
    </div>
</template>
<script setup name="Tabpanes">
import { ref,reactive, onActivated } from 'vue'
import { parameterList } from "@/api/product/parameter";
const props = defineProps({
    personList: {
        type: Object,
        default:[]
    },
    personLength:{
        type:Number,
        default:1
    },
    personView:{
        type:Boolean,
        default:true
    }
})
const itemList  = ref([])
function filterShow(){
    parameterList({
      type:'3',
      parent_id:props.personList.id,
      page_size:"-1",
      page_count:"-1"
   }).then(res=>{
       if(res.data.list){
        itemList.value = res.data.list;
        if(props.personView){
            let str=''
                res.data.list.forEach(itm=>{
                str+=itm.id+',';
               })
               if(str){
                   localStorage.setItem("id"+props.personList.id, str);
               }
        }
       }else{
        itemList.value=[]
       }
   })
      
}
filterShow()
</script>
<style scoped>
.list-title{
    background-color: rgb(241, 245, 249);
    line-height: 44px;
    padding-left:20px;
    margin-bottom: 20px;
}
.list-row{
    margin-left: 50px;
}
.list-input{
    width: 140px;
}
.list-title-line{
    color: blue;
    font-weight: bold;
}
</style>